.view_position{position: absolute;top: 0;left: 0;right: 0;bottom: 0;margin: auto;}
.color_selection{width:240px;height: 0;opacity:0;overflow:hidden;background:#fff;position: fixed;top: 0;left: 0;z-index:300;border-radius: 6px;transition: var(--anims23);box-shadow: 0px 3px 14px 2px #0000000d,0px 8px 10px 1px #0000000f,0px 5px 5px -3px #0000001a;}
.color_selection_show{height:308px;opacity: 1;overflow: hidden;}
.color_selection_show_ani{transition: var(--anims05);-webkit-transition:var(--anims05);}
.color_selection_view{padding: 7px 12px 15px;}
.history_view{overflow: hidden;}
.color_tool{overflow: hidden;}
.color_tool_l{float: left;font-size: 12px;line-height: 18px;height: 26px;padding: 4px 0;}
.color_tool_r{float: right;overflow: hidden;height: 26px;}
.color_tool_r>div{margin-left: 4px;width: 26px;height: 26px;float: left;cursor: pointer;position: relative;}
.color_tool_r>div:first-child{margin-left: 0;}
.color_tool_r div svg{position: absolute;top: 0;left: 0;right: 0;bottom: 0;margin: auto;}
.color_tool_r div .stroke{stroke:#333333;transition: 0.3s;-webkit-transition:0.3s;}
.color_tool_r div .fill{transition: 0.3s;-webkit-transition:0.3s;}
.color_tool_r div:hover .stroke{stroke:#1C996F;}
.color_tool_r div:active .stroke{stroke:#30B28DCC;}
.color_tool_r div:hover .fill{fill:#1C996F;}
.color_tool_r div:active .fill{fill:#30B28DCC;}

.color_tool_r .icon_1 svg{top: -2px;}
.color_tool_r .icon_2 svg{top: -3px;}
.color_tool_r .icon_3 svg{top: 0;}
.color_tool_r .icon_3 a{display: block;width: 100%;height: 100%;}
.color_content{overflow: hidden;position: relative;}
.color_part{overflow: hidden;}
.color_part .CR-list{display: inline-block;width:24px;height:24px;cursor: pointer;vertical-align:middle;}
.color_part .CR-list p {width: 24px;height:24px;border-radius:3px;}
.color_part .CR-list b {display:block;width:100%;height:100%;border:1px solid #fff;border-radius: 1px;overflow: hidden;background-color: #fff;transition:var(--anims03);-webkit-transition:var(--anims03);}
.color_part .CR-list s{display:block;width:100%;height:100%;background-color: #fff;padding:2px;border-radius: 2px;}
.color_part .CR-list i{width:100%; height:100%;border-radius:2px;display: block;}
.color_part .CR-list:hover b{border-color:transparent;background-color:transparent;}
.color_part_history li:first-of-type i{border:1px solid var(--corb07);position: relative}
.color_part_history li:first-of-type i::after{position: absolute;width: 9px;height:1px;content: '';top: 0;left: 0;right: 0;bottom: 0;margin: auto;background: var(--cord04);transform: rotate(135deg)}
.color_part_history .CR-list:first-child:hover b{border-color: var(--corb07);background-color:transparent;}
.color_part .CR-list-hover b{border-color:transparent;background-color:transparent;}
.color_style .color_style_view{background:#F2F6F4;border-radius: 4px;padding:4px;}
.color_style .color_style_view>li{padding: 2px 4px;font-size:12px;line-height: 1.5;transition: 0.3s;float: left;cursor: pointer;}
.color_style .color_style_view .active{background: #fff;}

.color_style .color_style_view>li:last-child{
	position:relative;
	padding-right:14px;
	float:right;
	display:none;
	z-index:100;
	padding:0px 14px 0px 0px;
	height:22px;
}
.color_style .color_style_view>li:last-child .CR-tag-val{
	display:inline-block;
	width:50px;
	text-align:center;
	white-space:nowrap;
	padding-left:4px;
	height:22px;
	line-height:22px;
}

.CR-tag-i{width:16px;height:22px;position: absolute;right:0;top:0;transition:var(--anims03);-webkit-transition:var(--anims03);}
.CR-tag-i svg{display:block;margin:9px auto 0;}
.CR-tag-i .stroke{stroke:#575757;}
.CR-tag.tags-color .CR-tag-i svg{transform: rotate(180deg);}
.color_container{overflow: hidden;padding-top: 7px;position: relative;}
.color_container .color_content{overflow: hidden;}
.color_other{overflow: hidden;}
.color_base{overflow: hidden;padding-top: 8px;}
.color_base>div{overflow: hidden;}
.color_icon{width:24px;height: 24px;position: relative;float: left;margin-right: 6px;cursor: pointer;}
.color_bg{width:24px;height: 24px;border-radius: 3px;overflow: hidden;float: left;background:#fff;border: 1px solid #D9D9D9;cursor: pointer; }
.color_input{width: 100px;height: 24px;border: 1px solid #d9d9d9;border-radius: 3px;padding: 2px 7px;background: #fff;float: left;margin-left: 6px;}
.color_input input{width: 100%;height: 18px;line-height: 18px;font-size: 12px;color: #333;float: left;}
.color_base_c{overflow: hidden;}
/* 拖动条，拖动改变颜色透明度 */
.CR-drag{height:10px;margin:10px 0;position: relative;}
.CR-drag-img{background-image:url(https://web2.xmyeditor.com/sucai-png/20240605/9331ea23a9942411b0072d84245ac9ff.png);width:100%;height:10px;border-radius:10px;}
.CR-drag-bg{position: absolute;left:0;top:0;width:100%;height:10px;border-radius:10px;background:linear-gradient(to right,rgba(10,10,10,0) 0%,#0C0C0C 100%);cursor: pointer;}
.CR-drag-move{position: absolute;left:0;top:-3px;width:15px;height:15px;border: 2px solid var(--corb07);background-color: var(--corb13);border-radius:50%;z-index:10 !important;}
.CR-drag-move:hover{cursor: pointer;border-color: var(--corb01);}
.CR-drag-move:active{transition:none;-webkit-transition:none;border-color: var(--corb01);}
.color_base_b{padding:8px 28px 0;overflow: hidden;display: none;}
.color_base_b div{cursor: pointer;padding: 2px 12px;background:#30B28D;color: #fff;font-size:12px;line-height: 20px;border-radius:4px;}
.color_base_export{float: left;}
.color_base_import{float: right;}
.color_gradient{overflow: hidden;display: none;padding-top: 8px;}
.color_gradient_t{overflow: hidden;margin-bottom: 8px;}
.color_gradient_t_s{float: left;overflow: hidden;}
.color_gradient_t .color_input{width: 75px;}
.color_gradient_t_e{float: right;overflow: hidden;}
.color_gradient_b{overflow: hidden;}
.color_gradient_b .color_bg{width: 20px;height: 20px;}
.color_input_text{margin-left: 6px;float: left;font-size: 12px;line-height:20px;}
.color_yy,.color_join,.color_record{cursor: pointer;padding: 0 12px;background:#30B28D;color: #fff;font-size:12px;line-height: 20px;border-radius:4px;float: right;display: none;}
.color_join,.color_record{display: none;line-height: 24px;}
.color_gradient_b .color_input{height: 20px;padding: 1px 7px;}
.color_gradient_b .color_input input{width:25px;float:left;line-height: 16px;height: 16px;}
/* 颜色选择器 */
.color_panel{position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index:10;background:#fff;display: none;}
.colorpicker{height:120px;position:absolute;display:none}
.colorpicker_color{width:192px;height:120px;left:0;top:0;position:absolute;background:#f00;cursor:crosshair}
.colorpicker_color>div{position:absolute;top:0;left:0;width:192px;height:100%;background-image:url(https://staticsa.xmyeditor.com/common/colorpicker/images/colorpicker_overlay.png);background-size:100% 100%}
.colorpicker_color>div>div{position:absolute;top:0;left:0;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;border:2px solid var(--corb01);}
.colorpicker_hue{position:absolute;top:0;right:0px;width:12px;height:114px;cursor:n-resize;background-image:url(https://staticsa.xmyeditor.com/common/colorpicker/images/colorpicker_bg.png);background-size:100% 100%}
.colorpicker_hue div{position:absolute;left:-5px;width:22px;height:8px;margin:-2px 0 0;border-radius:4px;background:var(--corb01);cursor: pointer;}
.colorpicker_hue p{transition: var(--anims03);-webkit-transition:var(--anims03);border:1px solid var(--corb04);border-radius:4px;width:100%;height:100%;}
.colorpicker_hue div:hover p{border-color: var(--cora07);}
.colorpicker_hue div:active p{border-color: var(--cora05);}
/* 颜色取色器选中状态 */
.CR-sel-on .CR-sel-i .stroke{stroke:var(--cora05);}
.CR-sel-on .CR-sel-i circle{fill:var(--cora05);}
.CR-sel-on .CR-cont{display:none;}
.CR-sel-on .CR-sel-box{display:block;}
.color_style::after,.color_style .color_style_view::after,.color_selection::after,.color_selection_view::after{display: table;clear: both;content: '';}


/*标签*/
.tag_level_one{
	position:absolute;
	top:24px;
	left:-100%;
	z-index:100;
	width:148px;
	transition:var(--anims23);
	-webkit-transition:var(--anims23);
	overflow:hidden;
	height:0px;
}
.tag_level_one01:hover{overflow:visible;}
.tag_view{width: 100%; padding: 10px 0;height: 100%;border: 1px solid #D9D9D9;border-radius: 4px;background:#fff;}
.tag_view li{padding: 3px 12px;cursor: pointer;position: relative;height: 38px;}
.tag_view li .tag_view_hover{-webkit-transition:0.5s;transition: 0.5s;line-height: 32px;border-radius:4px;height: 32px;}
.tag_view li:hover .tag_view_hover{background: #F2F6F4;}
.tag_item_icon{float: left;width: 20px; height: 20px; margin: 6px 6px 0;line-height: 20px;}
.tag_item_icon svg{vertical-align:middle;}
.tag_item_icon .stroke{stroke:#333333;}
.tag_item_text{float: left;line-height: 32px;font-size: 14px;}
.tag_level_two{
	position:absolute;
	right:-145px;
	z-index:13;
	width:148px;
	top:3px;
	height:0px;
	opacity:0;
	transition:var(--anims03);
	-webkit-transition:var(--anims03);
	overflow:hidden;
}
.tag_level_two .tag_item_icon svg{display:none;}
.tag_level_two .tag_item_icon .stroke{stroke:#30B28D;}
.tag_level_two .inner_div{-webkit-transition:0.5s;transition: 0.5s;line-height: 32px;border-radius:4px;height: 32px;}
.tag_level_two li:hover .inner_div{background: #F2F6F4;}
.tag_level_two .active .inner_div{background: #F2F6F4;}
.tag_level_two .active .tag_item_icon svg{display:block;}
.tag_level_two .tag_item_text{display:inline-block;width:85px;white-space: nowrap;}

.tag_item_3:hover .tag_level_two01{height:58px;opacity:1;}
.tag_item_3:hover .tag_level_two02{height:96px;opacity:1;}
.tag_item_3:hover .tag_level_two03{height:134px;opacity:1;}
.tag_item_3:hover .tag_level_two04{height:172px;opacity:1;}
.tag_item_3:hover .tag_level_two05{height:172px;opacity:1;}
.tag_level_two05 .tag_view{overflow-x:hidden;overflow-y:auto;}


/*标签-更多*/
.CR-tag-view{display:none;left:0;right:0;top:0;bottom:0;position: absolute;background:#FFFFFF;z-index:15;}
.CR-tag-view .CR-tag-default,.CR-tag-data .CR-tag-item,.CR-tag-set{border:1px solid transparent;padding: 2px 6px;font-size:12px;line-height: 1.5;color: var(--corb13);}
.CR-tag-default,.CR-tag-item,.CR-tag-set{float: left;margin-top: 6px;margin-right: 4px;cursor:pointer;}
.CR-tag-view-container::after{content: "";display: table;clear: both;}
.CR-tag-view-container .CR-tag-data{margin-top: 0;float: none;}
.CR-tag-data .CR-tag-item,.CR-tag-default,.CR-tag-set{background: var(--corb03)}
.CR-tag-view-container .CR-tag-default:first-child{background: var(--corb01);border: 1px solid var(--corb04)}
.CR-tag-default,.CR-tag-item,.CR-tag-set{border-radius: 20px;}
.CR-tag-set{background: var(--cora06);color: var(--corb01)}
.CR-tag-item{position: relative;}
.CR-tag-item .del_mark{display:none;position: absolute;width: 12px;height: 12px;background: var(--cord04);top: -5px;right: -5px;border-radius:50%;}
.CR-tag-item .del_mark::after{position: absolute;content:'';width: 8px;height: 1px;background: var(--corb01);left: 0;right: 0;top: 0;bottom: 0;margin: auto;}
.CR-tag-view .CR-tag-item-del,.CR-tag-view .CR-tag-item-disabled{opacity: 0.3;}
.CR-tag-item .default_view{display: none;}
.CR-tag-item .rename_view{width: 50px;display: none;}
.CR-tag-item .rename_view input{width:100%;line-height: 16px;font-size: 12px;outline: none;}
.show_view{display: block !important;}
.CR-tag-view .error{border-color: var(--cord04)}


/*-----------------颜色选择器 end-----------------------*/
/*标签新建*/
.COLORPU02{
    position:fixed;
    width:300px;
    height:150px;
    background-color:var(--corb01);
    top:50%;
    left:50%;
    margin-top:-75px;
    margin-left:-150px;
    box-shadow:var(--shade03);
    border-radius:4px;
    padding:16px;
    display:none;
    z-index: 501;
}
.COLORPU02-1{font-size:16px;line-height:20px;}
.COLORPU02-2{position:absolute;top:6px;right:6px;height:20px;width:20px;text-align:center;line-height:20px;cursor:pointer;}
.COLORPU02-2 .stroke{stroke:var(--corb07);transition:var(--anims03);-webkit-transition:var(--anims03);}
.COLORPU02-2:hover .stroke{stroke:var(--cora05);}
.COLORPU02-2:active .stroke{stroke:var(--cora07);}
.COLORPU02-3{margin-top:16px;height:34px;position:relative;border:1px solid var(--corb07);border-radius:4px;transition:var(--anims03);-webkit-transition:var(--anims03);}
.COLORPU02-3 .sp1{width:26px;height:26px;position:absolute;top:3px;left:10px;line-height:26px;font-size:0px;text-align:center;}
.COLORPU02-3 .sp1 svg{vertical-align:middle;}
.COLORPU02-3 .sp1 .stroke{stroke:var(--corb13);}
.COLORPU02-3 input{line-height:32px;width:100%;padding:0px 30px 0px 50px;border-radius:4px;}
.COLORPU02-3:hover{border-color:var(--corb11);}
.COLORPU02-3.logn-focus{border-color:var(--cora06);}
.COLORPU02-3 .sp2{
    position:absolute;
    right:8px;
    width:18px;
    height:18px;
    top:8px;
    cursor:pointer;
    background-color:var(--corb07);
    border-radius:20px;
    transition:var(--anims03);
    -webkit-transition:var(--anims03);
    text-align:center;
    line-height:16px;
    font-size:0px;
    display:none;
}
.COLORPU02-3 .sp2 .stroke{stroke:var(--corb01);}
.COLORPU02-3 .sp2:hover{background-color:var(--corb11);}
.COLORPU02-4{margin-top:16px;height:30px;}
.COLORPU02-4 p{width:120px;height:30px;text-align:center;border-radius:2px;transition:var(--anims03);-webkit-transition:var(--anims03);}
.COLORPU02-4 .p1{float:left;background-color:var(--cora04);color:var(--corb01);line-height:30px;cursor:no-drop;}
.COLORPU02-4 .p2{float:right;border:1px solid var(--corb04);line-height:28px;cursor:pointer;}
.COLORPU02-4 .p2:hover{background-color:var(--cora01);border-color:var(--cora03);color:var(--cora06);}
.COLORPU02-4 .p2:active{background-color:var(--cora01);border-color:var(--cora07);color:var(--cora07);}
.COLORPU02-0 .COLORPU02-3:hover .sp2{display:block;}
.COLORPU02-0 .COLORPU02-4 .p1{cursor:pointer;background-color:var(--cora06);}
.COLORPU02-0 .COLORPU02-4 .p1:hover{background-color:var(--cora05);}
.COLORPU02-0 .COLORPU02-4 .p1:active{background-color:var(--cora07);}